<template>
    <h2>用户购买理财页面</h2>
    <table >
        <tr>
            <td>理财名称</td>
            <td>
                {{info.F_name}}
            </td>
        </tr>
        <tr>
            <td>年收益</td>
            <td>
                {{info.F_APY}}
            </td>
        </tr>
        <tr>
            <td>理财最低金额</td>
            <td>
                {{info.F_MinMoney}}
            </td>
        </tr>
        <tr>
            <td>风险等级</td>
            <td>
               {{info.F_Level==0?"低风险":info.F_Level==1?"中风险":"高风险"}}
            </td>
        </tr>
        <tr>
            <td>购买金额</td>
            <td>
               <input type="text"  v-model="FMoney" @change="GetYearMoney"/>
            </td>
        </tr>
        <tr>
            <td>每年预计收益</td>
            <td>
                {{F_YearMoney.toFixed(2)}}CNY
            </td>
        </tr>
        <tr>
           <td colspan="2" style="text-align: center;">
               <input type="button" value="保存" class="btn btn-primary" @click="SaveData">
           </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
 import {ref,onMounted} from 'vue'
 
 import axios from 'axios'

 import { useRoute,useRouter} from 'vue-router';

 import {useUserStore} from '../../Store/Index.ts'

 //创建仓库实例
 const  useStore = useUserStore();

 alert(useStore.Uid)
 //创建路由对象
 const route = useRoute();

 //创建路由实例
 const router = useRouter();

 //创建购买金额响应式
 const FMoney = ref("");
 
 const F_YearMoney = ref(0);

 const info = ref({
    F_name:"",
    F_APY:0,
    F_MinMoney:0,
    F_Level:0,
 })

 //生命周期函数勾
 onMounted(()=>{
    LoadData();
 })
 
 //计算每年收益
 const GetYearMoney = ()=>{
      axios({
          url:"https://localhost:44337/api/Finans/GetUserIncome",
          method:"get",
          params:{
            UFmoney:FMoney.value,
            Fapy:info.value.F_APY
          }
      }).then(res=>{
          F_YearMoney.value=res.data;
      })
 }

 //反填数据
 const LoadData = ()=>{
    axios({
         url:"https://localhost:44337/api/Finans/GetFinanInfo",
         method:"get",
         params:{
             Fid:route.params.Fid
         }
      }).then(res=>{
          console.log(res.data)
          info.value=res.data;
      }).catch(err=>{
          console.log(err)
      })
 }

 //确认购买理财
 const SaveData =()=>{
       axios({
          url:"https://localhost:44337/api/Finans/AddUserFinanInfo",
          method:"post",
          data:{
            U_Id:useStore.Uid,
            F_Id:route.params.Fid,
            UF_Money:FMoney.value
          }
       }).then(res=>{
         if(res.data>0)
         {
            alert('购买成功!')
            router.push('/ShowAdminFinanInfo')
         } else if(res.data==-1)
         {
            alert('购买金额小于最低金额!')
         }
         else
         {
            alert('购买失败!')
         }
       })
 }
</script>